<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>menu</title>
    <link rel="stylesheet" href="__LAYUIMINI__/lib/layui-v2.6.3/css/layui.css" media="all">
    <link rel="stylesheet" href="__LAYUIMINI__/css/public.css" media="all">
    <style>
        .layui-btn:not(.layui-btn-lg):not(.layui-btn-sm):not(.layui-btn-xs) {
            height: 34px;
            line-height: 34px;
            padding: 0 8px;
        }
    </style>
</head>

<body>
    <div class="layuimini-container">
        <div class="layuimini-main">
            <div>
                <script type="text/html" id="toolbarDemo">
                    <div class="layui-btn-container">
                        <button class="layui-btn layui-btn-normal layui-btn-sm data-add-btn" lay-event="add"> 添加 </button>
                        <!-- <button class="layui-btn layui-btn-sm layui-btn-danger data-delete-btn" lay-event="delete"> 删除 </button> -->
                    </div>
                </script>
                <table id="cateList" class="layui-table" lay-filter="cateList"></table>
                <script type="text/html" id="switchBox">
                <input type="checkbox"  {{ d.status == '1' ? 'checked' : '' }} id="{{d.id}}" name="open" lay-skin="switch" lay-filter="switchTest" lay-text="ON|OFF">
                </script>
            </div>
        </div>
    </div>
    <!-- 操作列 -->
    <script type="text/html" id="auth-state">
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="edit">修改</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>

    <script src="__LAYUIMINI__/lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
    <script src="__LAYUIMINI__/js/lay-config.js?1" charset="utf-8"></script>
    <script>
        layui.use(['table','form'], function () {
            var $ = layui.jquery;
            var table = layui.table;
            var form = layui.form;

            // 创建渲染实例
            table.render({
                elem: '#cateList'
                , url: 'bannerCate' // 此处为静态模拟数据，实际使用时需换成真实接口
                , toolbar: '#toolbarDemo'
                , defaultToolbar: ['filter', 'exports', 'print', {
                    title: '帮助'
                    , layEvent: 'LAYTABLE_TIPS'
                    , icon: 'layui-icon-tips'
                }]
                , cellMinWidth: 80
                , page: true
                , cols: [[
                    { field: 'id',  title: 'ID'}
                    , { field: 'cate_name',  title: '标题'}
                    // , { field: 'status',  title: '状态',templet: '#switchBox'}
                    , {  title: '操作', toolbar: '#auth-state' }
                ]]
                , done: function () {
                    var id = this.id;
                   
                }
                , error: function (res, msg) {
                    console.log(res, msg)
                }
            });

             /**
            * toolbar监听事件
            */
            table.on('toolbar(cateList)', function (obj) {
                if (obj.event === 'add') {  // 监听添加操作
                    var index = layer.open({
                        title: '添加轮播分类',
                        type: 2,
                        shade: 0.2,
                        maxmin: true,
                        shadeClose: true,
                        area: ['600px', '600px'],
                        content: 'saveBannerCate',
                        end: function () {
                            table.reload('cateList');
                        }
                    });
                } 
            });


            //监听工具条
            table.on('tool(cateList)', function (obj) {
                var data = obj.data;
                var layEvent = obj.event;
                if (layEvent === 'del') {
                    var id = data.id
                    layer.msg('确定删除此分类？', {
                        time: 10000, //10s后自动关闭
                        btn: ['确定', '取消'],
                        btn1: function () {
                            $.ajax({
                                type: "post",
                                url: "delBannerCate",
                                data: { id: id },
                                dataType: "json",
                                success: function (res) {
                                    layer.msg(res.msg)
                                    if (res.code == 1) {
                                        table.reload('cateList');
                                    }
                                }
                            });
                        },


                    });

                } else if (layEvent === 'edit') {
                    var index = layer.open({
                        title: '修改分类',
                        type: 2,
                        shade: 0.2,
                        maxmin: true,
                        shadeClose: true,
                        area: ['600px', '600px'],
                        content: 'editBannerCate?id=' + data.id,
                        end: function () {
                            table.reload('cateList');
                        }
                    });
                }
            });

            // form.on('switch(switchTest)', function (data) {
            //     if(this.checked){
            //         var status = 1
            //     }else{
            //         var status = 0
            //     }
            //     var id = this.id
            //     $.ajax({
            //         type: "post",
            //         url: "bannerStatus",
            //         data: {id:id,status:status},
            //         dataType: "json",
            //         success: function (res) {
            //             if(res.code == 1)[
            //                 layer.msg(res.msg)
            //             ]
            //         }
            //     });
            // });



        });
    </script>
</body>

</html>